import React, {lazy ,Suspense} from "react";
import {store} from "@/store"
import appAction from "@/store/actions/appAction";

const routes = [
    {
        pid:0,
        id:1,
        path:'/',
        component:lazy(()=>import('@/layout/Home')),
        children:[
            {
                pid:1,
                id:11,
                path: '/',
                index: true,
                title: '首页',
                component:lazy(()=>import('@/views/dashboard')),
            },
            {
                pid:1,
                id:12,
                path: 'user',
                title: '用户管理',
                component:lazy(()=>import('@/layout/LayoutPage')),
                children:[
                    {
                        pid:12,
                        id:121,
                        path: 'list',
                        title: '用户列表',
                        component:lazy(()=>import('@/views/user/list')),
                    },
                    {
                        pid:12,
                        id:122,
                        path: 'admin',
                        title: '管理员用户列表',
                        component:lazy(()=>import('@/views/user/admin')),
                    }
                ]
            },
            {
                pid:1,
                id:13,
                path: 'system',
                title: '系统管理',
                component:lazy(()=>import('@/layout/LayoutPage')),
                children:[
                    {
                        pid:13,
                        id:131,
                        path: 'index',
                        title: '系统配置',
                        component:lazy(()=>import('@/views/system/index')),
                    },
                ]
            }
        ]
    },
    {
        pid:0,
        id:2,
        path:'/login',
        title:'登录',
        component:lazy(()=>import('@/views/login'))
    },
    {
        pid:0,
        id:3,
        path:'*',
        title:'404',
        component:lazy(()=>import('@/views/404'))
    }
]

// 懒加载
const syncRouter = (table)=>{
    let mRouteTable=[]
    table.forEach((route)=>{
        mRouteTable.push({
            path:route.path,
            element:(
                <Suspense fallback={<div>路由加载中...</div>}>
                    <route.component />
                </Suspense>
            ),
            children:route.children&&syncRouter(route.children)
        })
    })
    return mRouteTable
}



export const newRoutes = syncRouter(routes)
store.dispatch({type:'SET_MENUS',payload:routes})

